<template>
  <div>
    <van-tabbar v-model="active">
     <van-tabbar-item icon="wap-home-o"> <router-link to="/home">首页</router-link></van-tabbar-item>
      <van-tabbar-item icon="apps-o"><router-link to="/list">分类</router-link></van-tabbar-item>
      <van-tabbar-item icon="shopping-cart-o" :badge="num"><router-link to="/car">购物车</router-link></van-tabbar-item>
      <van-tabbar-item icon="contact"><router-link to="/mine">用户</router-link></van-tabbar-item>
      <!-- <van-icon name="shopping-cart-o" /> -->
    </van-tabbar>
  </div>
</template>

<script>
export default {
  data() {
    return {
      active: 0,
      num:0,
    //   navList: [
    //     {
    //       id: 1,
    //       title: "首页",
    //       icon: "home-o",
    //       path: "/home"
    //     },
    //     {
    //       id: 2,
    //       title: "分类",
    //       icon: "search",
    //       path: "/list"
    //     },
    //     {
    //       id: 3,
    //       title: "购物车",
    //       icon: "friends-o",
    //       path: "/car",
    //       num: "badge",
    //       nums: 0
    //     },
    //     {
    //       id: 4,
    //       title: "用户",
    //       icon: "setting-o",
    //       path: "/mine"
    //     }
    //   ]
    }
  },

  components: {},

  methods: {}
}
</script>

<style scoped>
.van-tabbar-item--active,
.van-tabbar-item--active a
{
    color: rgb(255, 136, 0);
}

</style>